<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册</title>
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="edge">
    <link rel="stylesheet" href="./assets/components/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="./assets/css/media.css"/>
    <link rel="stylesheet" type="text/css" href="./assets/css/reg.css"/>
    <link rel="stylesheet" href="./assets/components/icon-font/iconfont.css">
    <!--[if lt IE 9]>
    <script type="text/javascript" src="assets/js/html5shiv.min.js"></script>
    <![endif]-->
</head>
<body>

<header>
    <div class="container clearfix">
        <div class="logo-box">
            <a href="##">
                <img src="" alt="logo" width="170" height="60" class="img-rounded">
            </a>
            <b>欢迎注册</b>
        </div>
        <div class="have-account">
            已有帐号？
            <a href="login.html">请登录</a>
        </div>
    </div>
</header>

<div class="container">
    <div class="form-box clearfix">
        <form action="">
            <div class="form-item">
                <label>用&nbsp;&nbsp;&nbsp;户&nbsp;&nbsp;&nbsp;名</label>
                <input type="text" class="field" placeholder="您的账户名和登录名" id="form-name">
                <div class="help-content">
                    <i class="iconfont icon-cuowu"></i>
                    <span class="error-content">支持中文、字母、数字、“-”“_”的组合，4-20个字符</span>
                </div>
                <span class="glyphicon"></span>
            </div>
            <div class="form-item">
                <label>设 置 密 码</label>
                <input type="password" class="field" placeholder="建议至少使用两种字符组合" id="form-pwd">
                <div class="help-content">
                    <i class="iconfont icon-cuowu"></i>
                    <span class="error-content">建议使用字母、数字和符号两种及以上的组合，6-20个字符</span>
                </div>
                <span class="glyphicon"></span>
            </div>
            <div class="form-item">
                <label>确 认 密 码</label>
                <input type="password" class="field" placeholder="请再次输入密码" id="form-equalTopwd">
                <div class="help-content">
                    <i class="iconfont icon-cuowu"></i>
                    <span class="error-content">请再次输入密码</span>
                </div>
                <span class="glyphicon"></span>
            </div>
            <div class="form-item">
                <label>手&nbsp;&nbsp;&nbsp;机&nbsp;&nbsp;&nbsp;号</label>
                <input type="text" class="field" placeholder="建议使用常用手机" id="form-phone">
                <div class="help-content">
                    <i class="iconfont icon-cuowu"></i>
                    <span class="error-content">完成验证后，你可以用该手机登录和找回密码</span>
                </div>
                <span class="glyphicon"></span>
            </div>
            <div class="form-item">
                <label>验&nbsp;&nbsp;&nbsp;证&nbsp;&nbsp;&nbsp;码</label>
                <input type="text" class="field form-authCode" placeholder="请输入验证码" id="authCode">
                <p class="help-content">看不清？点击图片更换验证码</p>
                <img src="./assets/img/image.jpg" alt="" class="authCode-img">
            </div>
            <div class="form-item">
                <label>手机验证码</label>
                <input type="text" class="field form-authCode" placeholder="请输入手机验证码" id="phoneCode">
                <button type="button" class="btn-phonecode">获取验证码</button>
            </div>
            <div class="form-agreen">
                <div>
                    <input type="checkbox" name="agreen">
                    我已阅读并同意
                    <a href="##">《京东用户注册协议》</a>
                </div>
            </div>
            <div class="sumbut-btn">
                <button type="submit" class="btn btn-danger btn-block btn-lg">立即注册</button>
            </div>
        </form>
        <div class="right-box">
            空<br>白<br>留<br>位<br>想<br>放<br>啥<br>就<br>放<br>啥
        </div>
    </div>
</div>

<footer>
    <div class="container">
        <p>
            <a href="##">
                关于我们
            </a>
            |
            <a href="##">
                关于我们
            </a>
            |
            <a href="##">
                关于我们
            </a>
            |
            <a href="##">
                关于我们
            </a>
            |
        </p>
        <p>强势留位爱放啥 就放啥</p>


    </div>

</footer>
<script type="text/javascript" src="assets/components/jquery-1.9.1.min.js"></script>
<script src="assets/components/bootstrap.min.js" type="text/javascript"></script>
<script src="./assets/js/regForm.js"></script>
</body>
</html>